<template>
  <div>
    <el-form label-width="80px" label-position="right">
      <el-row :gutter="8">
        <el-col :span="6">
          <el-form-item label="应用名称" required>
            <el-input v-model="appInfo.appName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="调用指令" required>
            <el-input v-model="appInfo.callCmd"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="应用图标" required>
            <idea-icon v-model="appInfo.appIcon" placeholder="应用图标"></idea-icon>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="应用等级" required>
            <el-input-number v-model="appInfo.appLevel" placeholder="应用等级" :min="0" style="width: 100%"></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="18">
          <el-form-item label="应用描述">
            <el-input v-model="appInfo.appComment" placeholder="应用描述"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="应用版本">
            <el-input-number v-model="appInfo.appRelease" placeholder="应用等级" :min="0" style="width: 100%"></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item style="text-align: center">
            <el-button icon="el-icon-circle-check" type="success" :loading="loading" @click="saveApp(appInfo.appState)">{{ appInfo.appId ? '更新' : '保存' }}</el-button>
            <el-button v-if="appInfo.appState === 1" icon="el-icon-video-pause" :loading="loading" type="warning" @click="saveApp(-1)">下架</el-button>
            <el-button v-else icon="el-icon-video-play" type="warning" :loading="loading" @click="saveApp(1)">发布</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-tabs v-model="activeName">
      <el-tab-pane name="env" label="环境参数">
        <app-env-table />
      </el-tab-pane>
<!--      <el-tab-pane name="script" label="初始化脚本">
        <app-script-info />
      </el-tab-pane>-->
      <el-tab-pane name="quick" label="快捷访问" lazy>
        <app-quick />
      </el-tab-pane>
      <el-tab-pane name="store" label="资源管理" lazy>
        <app-store-table />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import IdeaIcon from "@/components/idea-icon/IdeaIcon";
import AppEnvTable from "@/views/system/app/env/AppEnvTable";
import AppQuick from "@/views/system/app/quick/AppQuick";
import AppScriptInfo from "@/views/system/app/script/AppScriptInfo";
import AppStoreTable from "@/views/system/app/store/AppStoreTable";
export default {
  name: "AppSeting",
  components: {AppStoreTable, AppScriptInfo, AppQuick, AppEnvTable, IdeaIcon},
  inject: {
    appInfo: {
      from: 'appInfo',
      default: function () {
        return { appId: '0' }
      }
    }
  },
  data() {
    return {
      loading:false,
      activeName: 'env'
    }
  },
  methods: {
    saveApp(state) {
      this.loading = true
      const body = this.$Util.copy(this.appInfo)
      body.appState = state || body.appState
      this.$post('appInfo/save?appId=' + this.appInfo.appId, body)
          .then(res => {
            this.$resultMsg(this, res)
            if (res.code === 200) {
              this.$Util.copyAttr(res.data, this.appInfo)
            }
            this.loading = false
          })
    }
  }
}
</script>

<style scoped>

</style>
